<!DOCTYPE html>
<html>
<head>
    <title>AngularJS on JAX-RS</title>
    <link rel="stylesheet" href="vendor/bootstrap/css/bootstrap.min.css"/>
</head>
<body ng-app="TodoApp" ng-controller="TodoCtrl">

<section id="notes" class="container">
    <button id="add-note" class="btn btn-primary" ng-click="addNote()">Add note</button>
    <article ng-repeat="note in notes" class="note">
        <h1><span class="title">{{ note.title }}</span>
            <button class="btn btn-danger" ng-click="remove(note)">-</button>
        </h1>

        <div class="summary">{{ note.summary }}</div>
    </article>
</section>

<div id="edit-note-modal" class="modal fade" tabindex="-1" role="dialog" ng-class="{'in show':isEditNoteMode()}">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Add note</h4>
            </div>
            <div class="modal-body">
                <form id="edit-note-form" ng-submit="save()">
                    <input type="text" ng-model="selectedNote.title" placeholder="Title" class="form-control" required/>
                    <textarea ng-model="selectedNote.summary" placeholder="Summary" class="form-control" required></textarea>
                    <button class="btn btn-primary" type="submit">Save</button>
                    <button class="btn btn-default" ng-click="cancel()">Cancel</button>
                </form>
            </div>
        </div>
    </div>
</div>

</body>
<script src="vendor/angular/angular.js"></script>
<script src="vendor/angular/angular-mocks.js"></script>
<script src="vendor/angular/angular-resource.js"></script>
<script src="api-settings.jsp"></script>
<script src="app/_app.js"></script>
</html>